<template>
    <div>
        <!-- 输入任意文本 -->
        <van-field v-model="id" label="酒ID" />
        <van-field v-model="name" label="酒名称" />
        <van-field v-model="degree" label="酒度数" />
		<van-field v-model="productionDate" label="生产日期" />
        <!-- <van-cell title="生产日期" :value="productionDate" @click="show = true" />
        <van-calendar v-model="show"  @confirm="onConfirm"  :show-confirm="false" /> -->
		<van-field v-model="luna" label="农历" />

		<van-field v-model="inboundDate" label="入库日期" />
        <!-- <van-cell title="入库日期" :value="inboundDate" @click="showInbound = true" />
        <van-calendar v-model="showInbound"  @confirm="onConfirmInbound"  :show-confirm="false" /> -->

        <van-field v-model="inventory" label="库存" />
        <van-field v-model="purchasePrice" label="购买价格" />
        <van-field v-model="sellPrice" label="销售价格" />
        <van-field v-model="scent" label="香型" />
        <van-field v-model="scentIngredient" label="香型成分" />
        <van-field v-model="rawMaterial" label="原材料" />
<!--        <van-field v-model="productStandard" label="生产标准" />-->
        <van-field v-model="fermentationProcess" label="发酵工艺" />
        <van-field v-model="fermentationCharacteristics" label="发酵特点" />
        <van-field v-model="fermentationPeriod" label="发酵期" />
        <van-field v-model="fermentationTemperature" label="发酵温度" />
        <van-field v-model="productClass" label="产品级别" />
        <van-field v-model="productionArea" label="产地" />
<!--        <van-field v-model="proportion" label="比例成分" />-->
        <van-field v-model="taste" label="香型特点" />
		<div>
			<div>酒库实景</div>
			<van-uploader
			        v-model="fileList"
			        multiple
			        :max-count="6"
			        :after-read="afterRead"
			></van-uploader>
		</div>
        
		<div>
			<div>酒厂实景</div>
			<van-uploader
			        v-model="fileList2"
			        multiple
			        :max-count="6"
			        :after-read="afterRead2"
			></van-uploader>
		</div>
		

        <van-row  type="flex" justify="space-around">
            <van-col>
                <van-button type="primary" v-on:click="add">Submit</van-button>
            </van-col>
        </van-row>

    </div>
</template>

<script>
    import {
        Image,
        Button,
        Uploader,
        Toast,
        DatetimePicker,
        Field,
        Calendar,
        Cell,
        Col,
        Row,
    } from 'vant'
    export default {
        name: "index",
		mounted() {
		
		},
        data() {
            return {
                // wineInfo
                id:"",
                name: '',
                degree: '',
                productionDate: '',
				luna: '',
                inboundDate: '',
                inventory: '',
                purchasePrice: '',
                sellPrice: '',
                scent: '',
                scentIngredient: '',
                taste: '',
                rawMaterial: '',
                productStandard:'',
                proportion: '',
                fermentationProcess:'',
                fermentationCharacteristics:'',
                fermentationPeriod:'',
                fermentationTemperature: '',
                productClass: '',
                productionArea: '',
                fileList: [],
				fileList2: [],
				imgList:[],
				imgList2:[],
                // 日历
                show: false,
                showInbound: false,
            }
        },
        components: {
            [Image.name]: Image,
            [Button.name]: Button,
            [Uploader.name]: Uploader,
            [Toast.name]: Toast,
            [DatetimePicker.name]: DatetimePicker,
            [Field.name]: Field,
            [Calendar.name]: Calendar,
            [Cell.name]: Cell,
            [Row.name]: Row,
            [Col.name]: Col,
        },
        methods: {
            // 图片上传
            async afterRead(file) {
                // 此时可以自行将文件上传至服务器
                // console.log('上传文件',file, this.fileList);
				let param = new FormData()
				param.append('file', file.file)
				param.append('path', "wine1")
				let {message, code, data} = await this.$api.postFile('/aliyun/upload',param)
				if (code === 1 && message === 'ok') {
					this.imgList.push(data)
					
				}else {
					Toast({
						message: 'Fail',
						icon: 'close'
					});
				}
            },
			async afterRead2(file) {
			    // 此时可以自行将文件上传至服务器
				let param = new FormData()
				param.append('file', file.file)
				param.append('path', "wine2")
				let {message, code, data} = await this.$api.postFile('/aliyun/upload',param)
				if (code === 1 && message === 'ok') {
					this.imgList2.push(data)
					
				}else {
					Toast({
						message: 'Fail',
						icon: 'close'
					});
				}
			},
            // 返回布尔值
            beforeRead(file) {
                if (file.type !== 'image/jpeg' && file.type !== 'image/png') {
                    Toast('请上传 jpg/png 格式图片');
                    return false;
                }

                return true;
            },
            // 返回 Promise
            asyncBeforeRead(file) {
                return new Promise((resolve, reject) => {
                    if (file.type !== 'image/jpeg' && file.type !== 'image/png') {
                        Toast('请上传 jpg/png 格式图片');
                        reject();
                    } else {
                        resolve();
                    }
                });
            },
            // Calendar 日历,选择日期区间
            formatDate(date) {
                return `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`;
            },
            onConfirm(date) {
                this.show = false;
                this.productionDate = this.formatDate(date);
                // console.log("productionDate: " + this.productionDate)
                // console.log("getTimestamp", this.getTimestamp(this.productionDate))

            },
            onConfirmInbound(date) {
                this.showInbound = false;
                this.inboundDate = this.formatDate(date);
                // console.log("inboundDate: " + this.inboundDate)
            },
            // 2020/2/14  转时间戳 秒
            getTimestamp(dataStr) {
                let date = new Date(dataStr)
                return date.getTime() / 1000;
            },
            async add() {
                try{
                    let {message, code, data} = await this.$api.post('/wine/add', {
                        id:this.id,
                        name: this.name,
                        degree: this.degree,
                        productionDate: this.getTimestamp(this.productionDate),
						luna: this.luna,
                        inboundDate: this.getTimestamp(this.inboundDate),
                        inventory: this.inventory,
                        purchasePrice: this.purchasePrice,
                        sellPrice: this.sellPrice,
                        scent: this.scent,
						scentIngredient: this.scentIngredient,
						
                        rawMaterial: this.rawMaterial,
                        productStandard: this.productStandard,
                        proportion: this.proportion,
                        taste: this.taste,
						fermentationProcess: this.fermentationProcess,
						fermentationCharacteristics: this.fermentationCharacteristics,
						fermentationPeriod: this.fermentationPeriod,
						fermentationTemperature: this.fermentationTemperature,
						productClass: this.productClass,
						productionArea: this.productionArea,
						uuid: "wine"+this.id,
						picture: this.imgList.join(','),
						picture2: this.imgList2.join(','),
                    })
                    if (code === 1 && message === 'ok') {
	
                        console.log(data)
                        Toast({
                            message: 'Success',
                            icon: 'passed'
                        });
                    }else {
                        Toast({
                            message: 'Fail',
                            icon: 'close'
                        });
                    }
                }catch (e) {
                    console.log(e)
                    Toast({
                        message: 'Fail',
                        icon: 'close'
                    });
                }
            }
        }

    }
</script>

<style scoped>
/deep/ .van-cell__value .van-field__body .van-field__control{
	border-bottom: 1px solid #aaffff;
	background-color: #aaffff !important;
}
.van-cell__value{
	background-color: aqua;
}
.van-field::after{
	border-bottom: 1px solid #0086B3;
}
</style>
